*{
    padding: 0;
    margin: 0; 
}
 
html,body{
    width: 100%;
}
@theme:#FF5556;
@rem:1px;
._dflex{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
._flex{
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.ui-container{
    width: 100%;
  img{
      width: 100%;
      height: 100%;
  }
}
.ui-center{
    text-align: center;
}
.ui-form-unstyledx .ui-form-group{
    border-bottom:0; 
}
.ui-form-group{
    ._dflex;
    height: 40*@rem;
    line-height: 40*@rem;
    padding-right:12*@rem;
    border-bottom: 1*@rem solid #ccc;
    overflow: hidden;
    .ui-form-label{
        width: 60*@rem;
        padding-left: 12*@rem;
    }
    &.ui-arrow{
        input,select{
            background: url("/static/images/arrow.png") no-repeat scroll right center transparent;
            /*为下拉小箭头留出一点位置，避免被文字覆盖*/
            background-size:15*@rem 10*@rem;
            padding-right: 5*@rem;
           }
    }
    .ui-form-input{
       ::-webkit-input-placeholder{
           color: #ccc;
       }
       :-ms-input-placeholder{
           color: #ccc;
       }
       ::placeholder{
           color: #ccc;
       }
       input{
            width: 100%;
            height: 100%;
            border: 0;
            outline: 0;
            appearance: none;
            -webkit-appearance: none;
            -moz-appearance: none;
       }    
       ._dflex;
                
    }
}

.loop-flex(@n, @i:2) when (@i <= @n) {
    .ui-flex-@{i} {
        -webkit-box-flex: @i;
        -ms-flex: @i;
            flex: @i;
    }
    .loop-flex(@n, (@i + 1));
}

.ui-flexbox{
    ._dflex;
    .loop-flex(12);
}
.ui-flex{
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.ui-tip{
    color: #bbb;
    padding: 12*@rem;
}
// 按钮
.ui-btn{
   text-align: center;
//    background: red;
   border: 1*@rem solid #ccc;
   display: inline-block;
   padding:2*@rem 5*@rem;
//    color: white;
}
.ui-btn-clear{
    color: @theme;
    border: 0;
}
.ui-btn-theme{
    background: @theme;
    border: 1*@rem solid  @theme;
    color: white;
}
.ui-btn-lg{
  display: block;
  height: 30*@rem;
  line-height: 30*@rem;
}
.ui-btn-md{
    // display: block;
    padding-left: 15*@rem;
    padding-right
    : 15*@rem;
    height: 30*@rem;
    line-height: 30*@rem;
  }
// ui-tab
.ui-tab{
    ._dflex;
    height: 40*@rem;
    text-align: center;
    line-height: 40*@rem;
    border-bottom: 1*@rem solid #ccc;
    .ui-tab-item{
        ._flex;
        &.active{
          color: @theme;
          border-bottom: 1*@rem solid @theme;
        }
    }
}
